<template>
	<my-main title="首页" isBg  @infoFun="infoFun">
		<template #mainHead>
			<view class="p-16">
				<view class="flex-between-center">
					<text class="f-36 fwb">{{ user?.UserName || '--' }}，您好</text>
				</view>
				<view class="f-22 m-t-8 alpha-6 flex-between-center">
					<text>{{user?.CompanyName || '欢迎使用ERP软件'}}</text>
					<text>
						{{ `${formatDate()} ${getDayName()}` }}
					</text>
				</view>
			</view>
		</template>
		<view class="muneBox">
			<view class="muneBox-item" :key="muneIndex" v-for="(mune, muneIndex) in formData.mune">
				<view class="muneBox-title">
					{{ mune.title }}
				</view>
				<view class="muneBox-center">
					<my-grid :column="4" :data="mune.children" @click="goPath">
						<template #item="{ row }">
							<view
								class="icon"
								:style="{
									background: row.iconBackground || '#3f61f1'
								}"
							>
								<view class="iconfont" :class="row.icon"></view>
							</view>
							<view class="title">{{ row.title }}</view>
						</template>
					</my-grid>
				</view>
			</view>
		</view>
		<template #footer>
			<view class="m-16">
				<my-button icon="icon-scan" @click="scanQRCode">快速扫码报工</my-button>
			</view>
		</template>
	</my-main>
</template>
<script lang="uts" setup>
import SelectGood from "@/pages/select/SelectGood/SelectGood.vue"
//公共状态
import { useVue  } from '@/utils/useVue.uts'
const { reactive, ref,app,Token,onMounted,watch,http,goToPage,OpenId,user,getDayName,formatDate } = useVue()
//
const isShow=ref(false)
const scanResult=ref('')
// 表单数据
const formData = reactive({
	mune:[],
	cateId:0,
	cateList:[
		 {
			id: '1',
			name: '解除微信绑定'
		},
	],
})
watch(() => Token, (newVal, oldVal) => {
	getUserMune()
});
const selectItem = (item) => {
  console.log(item);
};
// 扫一扫
const scanQRCode = () => {
	uni.scanCode({
		// 可选：扫码类型（默认自动识别）
		// onlyFromCamera: true, // 只允许从相机扫码
		// scanType: ['qrCode'],  // 只扫二维码，不扫条形码
		success: (res) => {
		  scanResult.value = res.result
		  uni.showToast({
			title: '扫码成功',
			icon: 'success',
			duration: 2000
		  })
		},
		fail: (err) => {
		  console.error('扫码失败:', err)
		  uni.showToast({
			title: '扫码失败',
			icon: 'none',
			duration: 2000
		  })
		}
	  })
}
// 获取用户菜单权限
const goPath = (row:any) => {
	goToPage(row.path)
}
// 获取用户菜单权限
const getUserMune = () => {
	http.request({
		url: 'api/AuthMan/GetUserComInfo',
		data: {},
		isNotToken: true,
		success: (res : any) => {
			formData.mune=setMune(res.rights)
		}
	})
}
// 获取用户菜单权限
const setMune = (arr:any) => {
	let _muneArr=[]
	arr.forEach((el:any)=>{
		let childrenArr=[]
		if(el.children?.length>0){
			getChildrenPush(childrenArr,el.children)
		}else{
			getPush(childrenArr,el)
		}
		if(childrenArr.length>0){
			_muneArr.push({
				title:el.Title,
				children:childrenArr,
			})
		}

	})
	return _muneArr
	function getChildrenPush(arr:any,children:any){
		if(children?.length>0){
			children.forEach((el:any)=>{
				if(el.children?.length>0){
					getChildrenPush(arr,el.children)
				}else{
					getPush(arr,el)
				}
			})
		}
	}
	function getPush(arr:any,row:any){
		if(row  && row.IsWap){
			arr.push({
				title:row.Title,
				icon:row.Icon || 'icon-niandubaogao',
				path:row.WapPath || row.Path,
				iconBackground:row.IconBackground,
				iconSize:row.IconSize,
			})
		}
	}
}

//初始运行参数
const infoFun = async  () => {
	getUserMune()
}
onMounted(() => {
})
</script>

<style scoped lang="scss">
.muneBox {
	.muneBox-item {
		margin-top: 16rpx;
		&:first-child {
			margin-top: 0;
		}
		.muneBox-title {
			font-weight: bold;
			font-size: 28rpx;
		}
		.muneBox-center {
			margin-top: 16rpx;
			background: #fff;
			padding: 16rpx 0;
			border-radius: 16rpx;
			.icon {
				width: 88rpx;
				height: 88rpx;
				color: #fff;
				background: #3f61f1;
				align-items: center;
				justify-content: center;
				display: flex;
				margin: 0 auto 8rpx;
				border-radius: 8rpx;
				overflow: hidden;
				position: relative;
				&::after {
					content: '';
					position: absolute;
					left: 0;
					top: 0;
					right: 0;
					bottom: 0;
					background: linear-gradient(145deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
				}
				.iconfont {
					position: relative;
					font-size: 44rpx;
					z-index: 2;
					filter: drop-shadow(2rpx 2rpx 6rpx 0 rgba(0, 0, 0, 0.5));
				}
			}
			.title {
				text-align: center;
				font-size: 22rpx;
				-webkit-line-clamp: 1; /* 限制文本显示的行数为2行 */
				-webkit-box-orient: vertical; /* 设置盒模型布局方向为垂直 */
				display: -webkit-box; /* 使用旧版WebKit内核布局盒模型 */
				overflow: hidden; /* 超出部分隐藏 */
				text-overflow: ellipsis; /* 使用省略号表示被截断的部分 */
			}
		}
	}
}
</style>
